
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>应用分类管理</title>
     <#include "../StaticFile.ftl">
    <script>
    
    

    var toolbar = [{
            text:'新增应用分类',
            iconCls:'icon-add',
            handler:function(){global.id=0;$('#dlg').dialog('open');clean();}
        }];
    
    </script>
</head>
<body>




<div id="cc" class="easyui-layout" style="width:100%;height:900px;">
     <#include "../Head.ftl">
     <#include "../Menu.ftl">
    <div data-options="region:'center',title:'数据显示区',split:true">
    
    <div style="margin-top:10px;padding-bottom:10px;">分类名称:<input class="easyui-textbox" type="text" id="search_title" name="search_title" ></input>
    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="doSearch()">查询</a></div>
    <table id="dg" title="应用分类管理" style="100%" data-options="
                singleSelect:true,
                autoRowHeight:false,
                pagination:true,
                url:'/category/getdata',
                pageSize:20,toolbar:toolbar">
        <thead>
            <tr>
                <th field="id" width="80"align="center">分类编号</th>
                <th field="title" width="180" align="center">分类名称</th>
                 <th field="sort" width="80" align="center">排列顺序</th>
                <th data-options="field:'icon',width:120,align:'center',formatter:formatIcon" width="100">分类图标</th>
                 <th data-options="field:'type',width:80,align:'center',formatter:formatType" width="100">分类类型</th>
                <th data-options="field:'status',width:80,align:'center',formatter:formatStatus" >分类状态</th>
                <th data-options="field:'operation',width:380,align:'center',formatter:formatOperation" >操作</th>
            </tr>
        </thead>
    </table>
   
    <div id="dlg" class="easyui-dialog" title="添加应用分类" data-options="iconCls:'icon-save'" style="width:400px;height:350px;padding:10px;">
        
            <table cellpadding="5">
                <tr>
                    <td>应用图标:</td>
                    <td>
                     <#assign name="category">
                  <#assign img_flag="0">
                   <#include "../FileUpload.ftl">
                    </td>
                </tr>
                <tr>
                    <td>分类名称:</td>
                    <td><input class="easyui-textbox" type="text" name="title" id="title" data-options="required:true,validType:'email'"></input></td>
                </tr>
                <tr>
                    <td>分类顺序:</td>
                    <td><input class="easyui-textbox" type="text" name="order" id="order" data-options="required:true"></input></td>
                </tr>
                 <tr>
                    <td>分类类型:</td>
                    <td>
                      <select class="easyui-combobox" name="type" id="type">
                        <option value="1">应用</option>
                        <option value="2">游戏</option>
                        </select>
                    </td>
                </tr>
                 
            </table>
       
         <div style="text-align:center;padding:5px">
            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="addElement()">添加</a>
            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="cleanForm()">取消</a> 
         </div>
        </div>
       
      </div>
      
      </div>
     <script>
        
        function cleanForm()
        {
        $('#dlg').dialog('close');
        }
          $(function(){
            var pager = $('#dg').datagrid().datagrid('getPager');
            $('#dlg').dialog('close');
             })
               // get the pager of datagrid
               
         function doSearch(){
            $('#dg').datagrid('load',{
         
            title: $("#search_title").textbox("getValue")
            });
            }
            var  global={id:0};
            function addElement()
            {
                
               var title =$("#title").textbox("getValue")
               if(!title){
                alert("分类名称不能为空");
                return;
                }
               var icon=$("#display_img_category").attr("src");
               if(!icon){
                alert("图标不能为空");
                return;
               }
               var order=$("#order").textbox("getValue");
               var reg = /^\d+$/;
               if(!order||!reg.test(order)){
                    alert("排序必须位数字并且不能为空");
                    return;
               }
               
                if(!window.confirm("确定保存么？"))
                {
                    return;
                }
                $.ajax({
                type: "POST",
                  url: "/category/add",
                  data:{
                  id:global.id,
                  title:title,
                  icon:icon,
                  order:order,
                  type:$("#type").combobox("getValue")
                  },
                  success:function(data)
                  {
                    //var result=jQuery.parseJSON(data);
                    
                    doSearch();
                    $('#dlg').dialog('close');
                    
                  }
                  });
            }
            
            function clean()
            {
                 var display_area=$("#form_upload_successful_category");
                
                  $('#form_upload_category').show();
                  $('#display_img_category').attr("src","");
                  $("#title").textbox("setValue","");
                  $("#order").textbox("setValue","");
                  $("#type").combobox("setValue",0);
                  display_area.hide();
                  
                   
            }
        function formatOperation(val,row)
        {
        
           
            if(row.status==0)
            {
                return '<a href="javascript:void(0)" class="easyui-linkbutton" style="padding-right:5px;" onclick="upadateStatus('+row.id+',1)">禁用</a><a href="javascript:void(0)" class="easyui-linkbutton"  onclick="editElement('+row.id+')">编辑</a>'
            }
            else
            {
                return '<a href="javascript:void(0)" class="easyui-linkbutton"  style="padding-right:5px;" onclick="upadateStatus('+row.id+',0)">启用</a><a href="javascript:void(0)" class="easyui-linkbutton" onclick="editElement('+row.id+')">编辑</a>'
               
            }
           
        }
        
         function upadateStatus(id,status)
            {
            
             if(!window.confirm("确定要修改么？"))
                {
                    return;
                }
                $.ajax({ type: "GET",
                url: "/category/changestatus?id="+id+"&status="+status,
                success: function(data)
                 {
                    var returnData=jQuery.parseJSON(data);
                    if(returnData.code==0)
                    {
                    // $('#dlg').dialog('close');
                        doSearch(); 
                        
                      // alert("chenggong");
                    }
                  }});
            }
        function formatStatus(val,row)
        {
            if(val==0)
            {
                return "正常"
            }
            else
            {
                return "禁用"
            }
        }
         function formatIcon(val,row)
        {
           return "<img style='high:30px;width:30px' src='"+val+"'/>";
        } 
        
        function editElement(id)
        {
        global.id=id;
              $.ajax({ type: "GET",
                url: "/category/getelement?id="+id,
                success: function(data)
                 {
                    var returnData=jQuery.parseJSON(data);
                    if(returnData.code==0)
                    {
                     $('#dlg').dialog('open');
                     var element=returnData.data;
                     $("#title").textbox("setValue",element.title),
                     $("#display_img_category").attr("src",element.icon),
                     $("#order").textbox("setValue",element.sort)
                      $("#type").combobox("setValue",element.type);
                     //doSearch(); 
                    var display_area=$("#form_upload_successful_category");
                    display_area.show();
                     $('#form_upload_category').hide();
                      // alert("chenggong");
                      
                    }
              
                  }});
        }
        
        function formatType(val,row)
        {
            var map={"0":"推荐","1":"应用","2":"游戏"};
            var returnValue=map[val+""];
            return returnValue?returnValue:"";
            
        }
    </script>
    
</body>
</html>